import path from "path";
import { defineConfig, loadEnv } from "vite";
import uni from "@dcloudio/vite-plugin-uni";
import AutoImport from "unplugin-auto-import/vite";
import { createHtmlPlugin } from "vite-plugin-html";
import { resolve } from "path";
import mkcert from "vite-plugin-mkcert";
import Components from "unplugin-vue-components/vite";
import { VantResolver } from "@vant/auto-import-resolver";
import postCssPxToRem from "postcss-pxtorem";
import {
  uniWidth,
  uniFontSize,
  designWidth,
  unitPrecision,
  iphone6Width,
} from "./src/utils/common/app.config.ts";
export default defineConfig(async ({ mode }) => {
  const UnoCss = await import("unocss/vite").then((i) => i.default);
  const envDir = "./env";
  const root = process.cwd();
  const config = loadEnv(mode, resolve(root, envDir));
  return {
    resolve: {
      // api: "modern-compiler",
      alias: {
        "@/": `${path.resolve(__dirname, "src")}/`,
        "@utils": `${path.resolve(__dirname, "src/utils")}/`,
      },
    },
    plugins: [
      uni(),
      UnoCss(),
      AutoImport({
        imports: ["vue", "uni-app", "pinia", "vue-i18n"],
        vueTemplate: true,
        resolvers: [VantResolver()],
        dirs: [
          "./src/static/js/types.ts",
          "./src/static/js/storage.ts",
          "./src/hooks/*",
        ],
        dts: "src/types/auto-import.d.ts",
        include: [/\.[tj]sx?$/, /\.vue$/, /\.vue\?vue/],
      }),
      createHtmlPlugin({
        minify: true,
        inject: {
          data: {
            ENABLE_ERUDA: "false",
            title: "หวยไทย",
            injectScript: `<script src="//cdn.jsdelivr.net/npm/eruda"></script>`,
          },
        },
      }),
      mkcert(),
      Components({
        resolvers: [VantResolver()],
        dirs: ["src/components/common"],
        dts: "src/types/components.d.ts",
        // extensions: ["vue", "jsx", "tsx", "ts", "js"],
        extensions: ["vue"],
        // directoryAsNamespace: true,
        globalNamespaces: [],
      }),
    ],
    server: {
      https: true, // 需要开启https服务
      port: 5173,
      strictPort: false, // 如果端口被占用则尝试其他端口
    },
    css: {
      preprocessorOptions: {
        scss: {
          silenceDeprecations: ["legacy-js-api"],
          javascriptEnabled: true,
          charset: false,
          // api: "modern-compiler", // or 'modern'
          additionalData: `@use "@/styles/global.scss" as *;`,
        },
      },
      postcss: {
        plugins: [
          postCssPxToRem({
            /*rootValue({ file }) {
              return file.indexOf("vant") !== -1
                ? iphone6Width / 10
                : (designWidth * uniFontSize) / uniWidth;
            },*/

            rootValue({ file }) {
              return (designWidth * uniFontSize) / uniWidth;
            },
            propList: ["*"],
            unitPrecision: unitPrecision,
            // selectorBlackList: ["van"], // 示所有包含 van 前缀的选择器将不会被 postcss-pxtorem 插件处理。
            exclude: (filePath: string) => {
              if (/src\/initial.scss/.test(filePath)) {
                return true;
              }
              return false;
            },
          }),
        ],
      },
    },
  };
});
